<template>
	<view>
		<view class="">
			<uni-card :is-full="true">
				<view class="addr">
					<view class="tip">
						<view class="now">
							我的当前收货地址
						</view>
						<view class="other" @click="toAddr">
							选择其他地址
						</view>
					</view>
					<view class="info">
						<view class="mobile">
							收货人：{{addr.name||''}} {{addr.phone||''}}
						</view>
						<view class="detail">
							收货地址：{{(addr.detail)||''}}
						</view>
					</view>
				</view>
			</uni-card>
		</view>
		<view class="" style="margin-top: 10px;">
			<view class="uni-list">
				<view class="content-box" v-for="(item,index) in goods" :key="item.id">
					<label class="uni-list-cell uni-list-cell-pd">
						<view class="right">
							<view class="img">
								<image :src="item.picture" mode=""></image>
							</view>
							<view class="rightg">
								<view class="title">
									{{item.name}}
								</view>
								<view class="spec">
									{{(item.num+$t.unit(item.specVal))||' '}}
								</view>
								<view class="price">
									<view class="">
										￥{{item.price}}
									</view>
									<view class="">
										总计:￥{{Number(item.price*item.num)}}
									</view>
								</view>
							</view>
						</view>

					</label>
				</view>
			</view>
		</view>
		<view class="noti">
			<view class="">
				<image src="../../static/tip.png" style="height: 20px;width: 20px;"></image>
			</view>
			<view class="">
				如您购买的商品有任何问题，请直接与购买商家联系，商家会为您处理，让您售后无忧
			</view>
		</view>
		<view class="bottom">
			<view class="sum">
				<label>合计：</label><label>￥{{totalPrice}}</label>
			</view>
			<view class="butt" @click="pay">
				<button type="warn">提交订单</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				goods: [],
				goodsput: [],
				totalPrice: 0,
				addr: {},
				order: {
					userId: '',
					money: '',
					status: '',
					addressId: '',
					remarks: '',
					orderDetails: []
				}

			};
		},
		onLoad() {
			// let pages = getCurrentPages();
			// let prevPage = pages[pages.length - 2];
			// let newsList = prevPage.$vm.list;

			// prevPage.$vm.list = newsList;
			// prevPage.$vm.$forceUpdate();
			let that = this;
			this.goods = uni.getStorageSync("carGoods");
			setTimeout(function() {
				that.totalPrice = Number(that.goods.map(item => {
					that.goodsput.push({
						id: item.id,
						number: item.num
					})
					return item.price * item.num
				}).reduce((n, m) => n + m)).toFixed(2)
			}, 1000)

		},
		onShow() {
			let that = this;
			this.getAddr()
		},
		methods: {
			getAddr() {
				let addr = uni.getStorageSync("addr")
				if (addr) {
					this.addr = addr;
				} else {
					this.apis.addrDefault().then(res => {
						this.addr = res;
					})
				}
			},
			toAddr() {
				uni.navigateTo({
					url: "/pagesOne/addr/addr?action=select"
				})
			},

			pay() {
				let that = this;
				let config = uni.getStorageSync("config");
				if (config && config.payNotice) {
					uni.showModal({
						title: "提示",
						content: config.payNotice,
						success: (res) => {
							if (res.confirm) {
								that.pays();
							} else if (res.cancel) {}
						}
					})
				} else {
					that.pays();
				}
			},
			pays() {
				let that = this;
				this.$t.fd(function() {
					console.log('go')
					if (!that.addr || !that.addr.phone) {
						uni.showModal({
							title: "提示",
							content: "请选择地址",
							showCancel: false
						})
						return
					}
					//赋值
					that.order.addressId = that.addr.id
					that.order.money = that.totalPrice
					that.goods.map(item => {
						that.order.orderDetails.push({
							goodId: item.goodId,
							num: item.num,
							sunMoney: item.num * item.price,
							carId: item.id
						})
					})
					//模拟提交订单--模拟支付
					uni.showModal({
						title: '提示',
						content: '是否确定支付...',
						success: function (res) {
							that.order.status = 1
							if (res.confirm) {
								that.apis.addOrder(that.order).then(res => {
									uni.navigateBack({})
								})
								console.log('用户点击确定');
							} else if (res.cancel) {
								that.order.status = 0
								that.apis.addOrder(that.order).then(res => {
									uni.navigateBack({})
								})
								console.log('用户点击取消');
							}
						}
					})
					console.log('提交订单')
					// uni.login({
					// 	provider: 'weixin',
					// 	success(reslogin) {
					// 		that.apis.pay(that.goodsput, {
					// 			code: reslogin.code,
					// 			addr: JSON.stringify(that.addr)
					// 		}).then(res => {
					// 			console.log(res)
					// 			if (res.sign) {
					// 				for (var i = 0; i < that.goods.length; i++) {
					// 					that.apis.delCar({
					// 						goodsId: that.goods[i].id
					// 					})
					// 				}
					// 				uni.requestPayment({
					// 					provider: 'wxpay', // 服务提提供商
					// 					timeStamp: res.timeStamp, // 时间戳
					// 					nonceStr: res.nonceStr, // 随机字符串
					// 					package: res.package,
					// 					signType: res.signType, // 签名算法
					// 					paySign: res.sign, // 签名
					// 					success: function(res) {
					// 						console.log('支付成功', res);
					// 						// 业务逻辑。。。
					// 						uni.switchTab({
					// 							url: "/pages/my/my"
					// 						})
					// 					},
					// 					fail: function(err) {
					// 						console.log('支付失败', err);
					// 					}
					// 				})
					// 			}

					// 		})
					// 	}
					// })
				})
			}
		}
	}
</script>

<style lang="scss">
	.addr {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
	}


	.tip {
		display: flex;
		flex-direction: row;
		width: 100%;
		justify-content: space-between;
		align-items: center;
		height: 40px;
		background-color: #E6D48C;
		border: 1px solid #E6D48C;
		position: relative;
	}

	.tip:before {
		border: 10px solid transparent;
		border-top-color: #E6D48C;
		position: absolute;
		content: "";
		left: 50%;
		top: 100%;
		margin-left: -10px;
	}

	.tip:after {
		border: 10px solid transparent;
		border-top-color: #E6D48C;
		position: absolute;
		content: "";
		left: 50%;
		top: 100%;
		margin-left: -10px;
		margin-top: -1px;
	}

	.now {
		margin-left: 10px;
		font-weight: bolder;
		color: #917810;
	}

	.other {
		margin-right: 10px;
	}

	.info {
		display: flex;
		flex-direction: column;
		width: 100%;
		justify-content: center;
		align-items: flex-start;
	}

	.mobile {
		margin: 10px 0px 0px 10px;
	}

	.detail {
		margin: 10px 0px 0px 10px;
	}

	.uni-list-cell {
		display: flex;
		font-size: 16px;
		position: relative;
		justify-content: flex-start;
		align-items: center;
		background-color: #fff;
		flex-direction: row;
	}

	.uni-list-cell-pd {
		padding: 11px 15px;
	}



	.uni-list {
		display: flex;
		background-color: #ffffff;
		position: relative;
		flex-direction: column;
		margin-bottom: 50px;

		.uni-list-cell::after {
			position: absolute;
			z-index: 3;
			right: 0;
			bottom: 0;
			left: 15px;
			height: 1px;
			content: "";
			-webkit-transform: scaleY(.5);
			transform: scaleY(.5);
			background-color: #c8c7cc;
		}
	}

	.img {
		flex: 1;

		image {
			width: 100px;
			height: 100px;
			margin-right: 5px;
		}
	}

	.right {
		display: flex;
		flex-direction: row;
		width: 100%;
	}

	.rightg {
		flex: 2;
		display: flex;
		flex-direction: column;
		padding-left: 5px;
		justify-content: space-between;
	}

	.title {
		overflow: hidden;
		height: 20px;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
	}

	.spec {
		margin: 7px 0px;
		color: #c8c7cc;
	}

	.price {
		font-size: 18px;
		color: #EC0D0D;
		display: flex;
		justify-content: space-between;
	}

	.noti {
		margin: 30px 30px;
		padding: 15px;
		background: rgba(250, 79, 81, 0.22);
		display: flex;
		margin-bottom: 80px;
	}

	.bottom {
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: fixed;
		bottom: 0px;
		width: 100%;
		background-color: #ffffff !important;
		z-index: 100000;
		height: 50px;
	}

	.sum {
		color: #EC0D0D;
		font-size: 18px;
		font-weight: 700;
		margin-left: 10px;
	}

	.butt button {
		border-radius: 20px;
		line-height: 33px;
		margin-right: 10px;
	}
</style>
